<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<link rel="stylesheet" href="testsuite.css" />
<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript" src="testrunner.js"></script>
<!-- include metadata plugin two times to make sure that doesn't hurt anyone -->
<script type="text/javascript" src="../jquery.metadata.js"></script>
<script type="text/javascript" src="../jquery.metadata.js"></script>
<script type="text/javascript" src="test.js"></script>
</head>

<body>
<h1>jQuery - Metadata Test Suite</h1>
<h2 id="banner"></h2>
<h2 id="userAgent"></h2>

<div id="main" style="display: none">
	<ol id="one">
		<li class="test test2" data="foo:'bar', bar:'baz', arr:[1,2]">Some stuff</li>
		<li class="test test2" data="{test:'bar', bar:'baz'}">Some stuff</li>
		<li class="test test2" data="{zoooo:'bar', bar:{test:'baz'}}">Some stuff</li>
		<li class="test test2" data="{number:true, stuff:[2,8]}">Some stuff</li>
	</ol>
	
	<ol id="two">
		<li class="test {foo:'bar',bar:'baz',arr:[1,2]} test2">Some stuff</li>
		<li class="{test:'bar',bar:'baz'} test test2">Some stuff</li>
		<li class="test test2 {zoooo:'bar',bar:{test:'baz'}}">Some stuff</li>
		<li class="some styles {number:true,stuff:[2,8]}">Some stuff</li>
	</ol>
	
	<ol id="three">
		<li class="test test2"><script type="data">foo:'bar', bar:'baz', arr:[1,2]</script>Some stuff</li>
		<li class="test test2"><script type="data">{test:'bar', bar:'baz'}</script>Some stuff</li>
		<li class="test test2"><script type="data">{zoooo:'bar', bar:{test:'baz'}}</script>Some stuff</li>
		<li class="test test2"><script type="data">{number:true, stuff:[2,8]}</script>Some stuff</li>
	</ol>
	<script type="data">test("execute script with type='data'", function() { ok( false, "Script tag with type='data' was executed!"); });</script>
	
	<ol id="four">
		<li class="test test2" data="foo:'bar', bar:'baz', arr:[1,2]">Some stuff</li>
		<li class="test test2" data="{test:'bar', bar:'baz'}">Some stuff</li>
		<li class="test test2" data="{zoooo:'bar', bar:{test:'baz'}}">Some stuff</li>
		<li class="test test2" data="{number:true, stuff:[2,8]}">Some stuff</li>
	</ol>
	
	<select class="{required:true}" name="meal" id="meal">
		<option value="">Please select...</option>
		<option value="1">Food</option>
		<option value="2">Milk</option>
	</select>
</div>

<ol id="tests"></ol>
</body>

</html>
